<template>
    <div>
         <nav>
            <div  v-for="(item,index) in arr1" :key="index" :class="{bg:index==active}" 
            @click="$emit('gb',index)">
                {{item}}
            </div>
        </nav>
    </div>
</template>

<script>
export default {
    props:['active','arr1'],


    mounted() {

    },
    methods: {

    },
};
</script>

<style lang='scss' scoped >
nav{
    width: 100%;
    background-color: darkgreen;
    height: 50px;
    display: flex;
    justify-content: space-between;
    div{
        width: 20%;
        line-height: 50px;
        color: white;
        text-align: center;
    }
    .bg{
        color: black;
    }
}
</style>
